<div class="subhead ">
  <div class="container mx-auto">
    <div class="log-settings float-right">
      <ul>
        <li><%= link to: ~p"/billing/edit" do %><i class="fas fa-money-bill"></i><span class="hide-on-mobile"> billing</span><% end %>

        </div>
        <h5>~/<%= link "billing", to: ~p"/billing/edit", class: "text-primary" %>/subscription/confirm</h5>
      </div>
    </div>
    <div class="content container mx-auto">
      <h4 class="header-margin">Redirecting...</h4>
      <p>You're being redirect to Stripe. If you're not redirected automatically click the button below.</p>
      <button onclick="return checkout();" class="btn btn-primary form-button">Continue</button>
    </div>
    <script src="https://js.stripe.com/v3/"></script>
    <script>
      checkout();

      function checkout() {

          var stripe = Stripe('<%= @stripe_key %>');

          stripe.redirectToCheckout({
              sessionId: '<%= @stripe_session.id %>'
          }).then(function (result) {
              // If `redirectToCheckout` fails due to a browser or network
              // error, display the localized error message to your customer
              // using `result.error.message`.
              consol.log("failed")
          });

          }
    </script>
